<!--
 * @文件路径         : \campus-running-errands\uniapp\pages\index\dy1\dy1.vue
 * @作者名称         : 梦宇
 * 版权信息         : QQ:403445452,禁止转载！禁止抄袭
 * @创建日期         : 2022-06-28 19:49:42
-->
<template>
  <view>
    <p class="head">快递大小</p>
    <div class="Classification">
      <p
        class="backling"
        :id="Render == index ? 'ClickRender' : ''"
        v-for="(item, index) in backling"
        :key="index"
        @click="ClickRender(index)"
      >
        {{ item }}
      </p>
    </div>
    <poput :Render="Render"></poput>
    <Button :backling="backlin"></Button>
    <!-- 取件信息 -->
    <div>
      <p>取件信息</p>
    </div>
  </view>
</template>

<script>
import poput from "@/components/popup.vue";
import Button from "@/components/index/selectButton.vue";
export default {
  data() {
    return {
      backling: ["小件", "中件", "大件"],
      Render: 3,
      backlin: [
        {
          text: "收件地址",
          text2: "请选择地址",
        },
        {
          text: "快递商家",
          text2: "请选择快递点",
        },
      ],
    };
  },
  onLaunch() {},
  methods: {
    ClickRender(e) {
      this.Render = e;
      if (e === 0) {
      } else if (e === 1) {
      } else if (e === 2) {
      }
    },
  },
  components: {
    poput,
    Button,
  },
};
</script>

<style lang="less" scoped>
.head {
  width: 100%;
  display: flex;
  justify-content: center;
  font-size: 20px;
}
.Classification {
  display: flex;
  justify-content: space-around;

  .backling {
    border: 2px solid rgb(248, 5, 5);
    padding: 5px 15px;
    border-radius: 25%;
  }
  #ClickRender {
    background-color: aquamarine;
  }
}
</style>